﻿<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>图库列表</title>
    <link rel="stylesheet" href="../assets/fonts/iconfont.css">
    <link rel="stylesheet" href="../assets/css/base.css">
    <link rel="stylesheet" href="../assets/css/sn-style.css">
    <link rel="stylesheet" href="../assets/css/pic-list.css">
</head>

<body>
    <!--header引入区域-->
    <div class="headerbgc">
        <div style="border-bottom:1px solid rgb(228, 228, 228);">
            <div class="head">
                <a href="#" class="logoImg"> <img src="./../assets/image/logo.svg" alt=""></a>
                <p>
                    <a href="#">首页</a>
                    <a href="#">资讯</a>
                    <a href="#" class="nav-active">素材库</a>
                    <a href="#">商业地产</a>
                    <a href="#">供应商</a>
                </p>
                <div class="search-head">
                    <select>
                        <option value="">资讯</option>
                        <option value="">商场</option>
                        <option value="">服务商</option>
                    </select>
                    <input type="text" name="" value="">
                    <a href="#"><img src="./../assets/image/head-search.svg" alt=""></a>
                </div>
                <span class="headLink"><a href="./login/register.html">注册</a><a href="./login/login.html" class="login-link">登录</a></span>
            </div>
        </div>
    </div>
    <div style="height:80px;"></div>
    
    <div class="container layout sn-clr">
        <div class="pic-title">
            <span>所有素材</span>&nbsp;&nbsp;&nbsp;&nbsp;>
            <a href="#">节日美陈&nbsp;&nbsp;X</a>>
            <a href="#">新年图库&nbsp;&nbsp;X</a>>
            <a href="#">户外广场&nbsp;&nbsp;X</a>
        </div>
        <div class="classify">
            <span>素材分类：</span>
            <a href="#"><img src="./../assets/image/all-class.png" alt="">所有素材</a>
            <a href="#"><img src="./../assets/image/pic-class.png" alt="">图片素材</a>
            <a href="#"><img src="./../assets/image/fa-class.png" alt="">方案素材</a>
            <a href="#"><img src="./../assets/image/wa-class.png" alt="">文案素材</a>
        </div>
        <div class="result-title">
            <div class="tab">
                <a href="#" class="act">最新</a>
                <a href="#" class="">人气</a>
            </div>
            <div class="page-top">
                共 1,366,671 个结果&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <a href="#">上一页</a>
                <input type="text" style="width:83px;">&nbsp;&nbsp;/ 13667&nbsp;&nbsp;&nbsp;&nbsp;
                <a href="#">确认</a>&nbsp;&nbsp;&nbsp;&nbsp;
                <a href="#">下一页</a>
            </div>
        </div>
        <div class="zixun-box">
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
            <div class="zixun-index">
                <img src="./../assets/image/pic-list-index.png" alt="">
                <p><span class="bq">文案素材</span>海豹彩绘主题展高清无水41P...</p>
                <div class="look-time">
                    <img src="./../assets/image/look.png" alt="" class="look">&nbsp;66721&nbsp;&nbsp;
                    <img src="./../assets/image/time.png" alt="" class="time">&nbsp;2017-11-21&nbsp;&nbsp;
                </div>
            </div>
        </div>
         <!-- 分页容器 -->
        <div class="tcdPageCode"></div>
    </div>
    <div class="foot">
        <div class="layout">
            <div class="left-bot">
                <img src="./../assets/image/bot-logo.svg" alt="">
                <p><span style="margin-right:30px;">关于我们</span><a href="#">关于我们</a>|<a href="#">关于我们</a>|<a href="#">关于我们</a>|<a href="#">关于我们</a></p>
                <p><span style="margin-right:30px;">新手入门</span><a href="#">注册新用户</a>|<a href="#">用户帮助中心</a></p>
                <p><span style="margin-right:30px;">网站规则</span><a href="#">网站服务协议</a>|<a href="#">网站注册协议</a>|<a href="#">网站版权声明</a></p>
                <p style="color:#BCBCBC;">©ALIMAMA MUX, powered by alimama THX.法律声明<br>
转载内容版权归作者及来源网站所有，本站原创内容转载请注明来源，商业媒体及纸媒请先联系：sangxing@taobao.com</p>
            </div>
            <div class="right-bot">
                <h3>有情链接</h3>
                <p class="sn-clr"><span>友情链接1</span><span>友情链接1</span><span>友情链接1</span><span>友情链接1</span><span>友情链接1</span><span>友情链接1</span><span>友情链接1</span><span>友情链接1</span><span>友情链接1</span></p>
                <div class="circle">
                    <img src="./../assets/image/bot-circle.png" alt="">
                    <img src="./../assets/image/bot-circle.png" alt="">
                    <img src="./../assets/image/bot-circle.png" alt="">
                </div>
            </div>
        </div>
    </div>
</body>
<script src="./../assets/build/jquery/dist/jquery.js"></script>
<script src="./../assets/build/pagejs/jquery.page.js"></script>
<script>
    $(function(){
        $(".tcdPageCode").createPage({
            pageCount:20,
            current:1
    });
        $(".tab li").on("click", function(event) {
        $(".tab li")
            .eq($(this).index())
            .addClass("activ")
            .siblings()
            .removeClass("activ");
        $(".tabCon .item")
            .hide()
            .eq($(this).index())
            .show();
        });
    })
</script>
</html>